<template>
    <div>
    <Input placeholder="Enter something..." v-model='nsearch' style="width: 200px"></Input> 
      <Button type="primary" shape="circle" @click="searchData(nsearch)" icon="ios-search"></Button>
    <Tabs type="card" v-model='value' @on-click='changenum(value)'>
        <TabPane label="第一页" name=1><Table border :columns="columns7" :data='data6'></Table></TabPane>
        <TabPane label="第二页" name=2><Table border :columns="columns7" :data='data6'></Table></TabPane>
        <TabPane label="第三页" name=3><Table border :columns="columns7" :data='data6'></Table></TabPane>
        
    </Tabs>
    <Modal
        v-model="modal1"
        title="产品编辑"
        @on-ok="ok"
        @on-cancel="cancel"
        v-for="(data,key) in data6"
        >
        <Form label-position="top" ref='data6[num]' :model='data6[num]'>
            <FormItem label="价格" prop="price">
                <Input type="text" v-model="data6[num].price"></Input>
            </FormItem>
            <FormItem label="生产地" prop="place">
                <Input type="password" v-model="data6[num].place"></Input>
            </FormItem>
            <FormItem label="产品名" prop="product">
                <Input v-model="data6[num].product" prop="product" :rows="4"></Input>
            </FormItem>
            <FormItem label="类型" prop="product">
                <Input v-model="data6[num].type" prop="type" :rows="5"></Input>
            </FormItem>
            <FormItem>
                  <Button type="primary" @click="updata(data6[num])">更新</Button>
                  <Button type="ghost" @click="handleReset(data6[num])" style="margin-left: 8px">重置</Button>
            </FormItem>
        </Form>
    </Modal>
        <Page :total="total" size="small" show-elevator show-sizer :page-size="data1.limit" @click='changenum(on-change)' @on-page-size-change="get " @on-change='page'></Page>
    </div> 
</template>
<script>
   import product from '../../../common/product'
    export default{
        mixins:[product],
        methods:{
            searchData(a){
                this.$http({
                method:'post',
                data:{
                    page: this.data1.page,
                    limit:this.data1.limit
                },
              url:`http://localhost:3000/product/search/${a}`
            })
                .then((response)=>{
                    this.data6=response.data.docs;
                })
            }
        }
    }     
</script>
